import { useState, useEffect } from 'react'
export const useMousePosition = (time: number = 0) => {
    const [position, setPosition] = useState({ x: 0, y: 0 })

    useEffect(() => {

        let timerId: null | NodeJS.Timeout = null

        const mouseMoveHandle = (e: MouseEvent) => {
            if (timerId) return
            timerId = setTimeout(() => {
                console.log(e.clientX, e.clientY)
                setPosition({ x: e.clientX, y: e.clientY })
                timerId = null
            }, time)
        }

        window.addEventListener('mousemove', mouseMoveHandle)
        return () => { window.removeEventListener('mousemove', mouseMoveHandle) }
    }, [])

    return position
}

type UseCountDown = (time?:number)=>[number,boolean]
export const useCountDown:UseCountDown = (time:number = 10) => {
    const [count, setCount] = useState(time)

    const [disabled, setDisabled] = useState(true)

    useEffect(() => {
        let timerId = setTimeout(() => {
            if (count > 1) {
                setCount(prev => prev - 1)
            } else {
                setDisabled(false)
            }
        }, 1000)
        return () => { clearTimeout(timerId) }
    }, [count])

    return [count,disabled]
}


